<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/11/21
  Time: 13:01
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="js/echarts.js"></script>
    <script src="js/echarts-gl.min.js"></script>
</head>
<body>
<div style="width: 800px; height: 800px" id="mDiv"></div>
<script type="text/javascript">


    function createNodes(widthCount, heightCount) {
        var nodes = [];
        for (var i = 0; i < widthCount; i++) {
            for (var j = 0; j < heightCount; j++) {
                nodes.push({
                    x: Math.random() * window.innerWidth,
                    y: Math.random() * window.innerHeight,
                    value: 1
                });
            }
        }
        return nodes;
    }

    function createEdges(widthCount, heightCount) {
        var edges = [];
        for (var i = 0; i < widthCount; i++) {
            for (var j = 0; j < heightCount; j++) {
                if (i < widthCount - 1) {
                    edges.push({
                        source: i + j * widthCount,
                        target: i + 1 + j * widthCount,
                        value: 1
                    });
                }
                if (j < heightCount - 1) {
                    edges.push({
                        source: i + j * widthCount,
                        target: i + (j + 1) * widthCount,
                        value: 1
                    });
                }
            }
        }
        return edges;
    }

    var nodes = createNodes(50, 50);
    var edges = createEdges(50, 50);

    var option = {
        series: [{
            type: 'graphGL',
            nodes: nodes,
            edges: edges,
            itemStyle: {
                color: 'rgba(255,255,255,0.8)'
            },
            lineStyle: {
                color: 'rgba(255,255,255,0.8)',
                width: 3
            },
            forceAtlas2: {
                steps: 5,
                jitterTolerence: 10,
                edgeWeightInfluence: 4
            }
        }]
    };
    var mc = echarts.init(document.getElementById("mDiv"));
        mc.setOption(option);
</script>
</body>
</html>
